<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('服务器管理')" />
</head>
<body class="gray-bg">
	<section class="content">
		<div class="box box-default" style="margin-bottom: 10px;">
			<div class="box-body">
				<div class="col-sm-12 search-collapse">
					<form id="formSearch">
						<div class="select-list">
							<ul>
								<li>
									用户名称：<input type="text" name="username" id="username" placeholder="请输入用户名称"/>
								</li>
								<li>
									<a class="btn btn-primary btn-rounded btn-sm" id="btn_query"><i class="fa fa-search"></i>&nbsp;搜索</a>
									<a class="btn btn-warning btn-rounded btn-sm" id="btn_reset"><i class="fa fa-refresh"></i>&nbsp;重置</a>
								</li>
							</ul>
						</div>
					</form>
				</div>
		    </div>
	    </div>
	    <div class="jax-box-table">
	        <div id="toolbar">
                <button id="btn_add" type="button" class="btn btn-primary btn-sm" shiro:hasPermission="server:add">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
                </button>
	        </div>
	        <table id="table"></table>
	    </div>
	</section>
	<th:block th:include="include :: footer" />
	<script>
    var editFlag = "[[${@permission.hasPerm('server:edit')}]]";
    var deleteFlag = "[[${@permission.hasPerm('server:delete')}]]";
	var terminalFlag = "[[${@permission.hasPerm('server:terminal')}]]";
    var columns=[
        {
            field: 'host',
            title: '服务器ip',
            align : "center"
        }, {
            field: 'port',
            title: '端口',
            align : "center"
        },
        {
            field: 'username',
            title: '登录用户',
            align : "center"
        },
        {
            field: 'passsalt',
            title: '密码加密混淆值',
            align : "center"
        },
        {
            field : 'operation',
            title : '操作',
            align : "center",
            formatter : function(value, row, index) {
            	var actions = [];
            	if(editFlag=="true") {
            		actions.push('<a class="btn btn-success btn-xs cursor-pointer" href="javascript:;" onclick="editServer('+row.id+')"><i class="fa fa-edit"></i>编辑</a> ');
            	}
            	if(deleteFlag=="true") {
            		actions.push('<a class="btn btn-danger btn-xs cursor-pointer" href="javascript:;" onclick="deleteServer('+row.id+')"><i class="fa fa-remove"></i>删除</a> ');
            	}
				if(terminalFlag=="true") {
					actions.push('<a class="btn btn-info btn-xs cursor-pointer" href="javascript:;" onclick="getServer('+row.id+')"><i class="fa fa-tv"></i>登录终端</a> ');
				}
                return actions.join('');
            }
        }
	];
  	//查询参数
    function queryParams(params) {
        var temp = { //这里的键的名字和控制器的变量名必须一致，这边改动，控制器也需要改成一样的
            limit : params.limit, //页面大小
            offset : params.offset, //页码
            username: $("#username").val(),
        };
        return temp;
    }
    var options={
        id:"#table",
        url: '/serverCon/list',
        columns:columns,
        queryParams : queryParams,
    }
    $.table.initTable(options);
    /*搜索*/
    $("#btn_query").click(function(){
    	$.table.refreshTable();
    });
    /*重置*/
	$("#btn_reset").click(function() {
		$.common.clearForm("formSearch");
		$.table.refreshTable();
	});
    /*新增*/
    $("#btn_add").click(function(){
    	$.modal.dialog_open("新增服务器", "/serverCon/add");
    });
    /*编辑*/
    function editServer(id) {
    	$.modal.dialog_open("编辑服务器", "/serverCon/edit?&id=" + id);
    }

	function getServer(id) {
		$.modal.dialog_detail("终端", "/serverCon/terminal?&id=" + id,1200,850);
	}
    /*删除*/
    function deleteServer(id) {
    	$.modal.confirm("确定删除该服务器？",function () {
        	$.common.postAjax("/serverCon/delete", {"id": id}, function (data) {
                if (data.code == 0) {
                	$.table.refreshTable();
                	toastr.success(data.msg);
                } else {
                	toastr.error(data.msg);
                }
            })
        })
    }
	</script>
</body>
</html>